<template>
	<view class="login-container">
		<view class="logo-area">
			<image class="logo" src="/static/logo.png" mode="aspectFit"></image>
			<text class="title">沛芮PREPEARL</text>
		</view>
		
		<view class="login-card">
			<view class="welcome-text">
				<text class="welcome">欢迎使用</text>
				<text class="tips">请登录后继续使用</text>
			</view>
			
			<button class="wx-login-btn" open-type="getUserInfo" @getuserinfo="handleGetUserInfo" :disabled="isLoading">
				<image class="wx-icon" src="/static/wechat.png" mode="aspectFit"></image>
				<text>{{ isLoading ? '登录中...' : '微信一键登录' }}</text>
			</button>
			<!-- 用户协议和隐私政策
			<text class="policy-text">登录即表示您同意《用户协议》和《隐私政策》</text>
			-->
		</view>
	</view>
</template>

<script>
	import api from '../../api/index.js';
	
	export default {
		data() {
			return {
				isLoading: false
			}
		},
		onLoad() {
			// 检查是否已登录
			const access_token = uni.getStorageSync('access_token');
			if (access_token) {
				// 获取用户信息
				const userInfo = uni.getStorageSync('userInfo');
				
				// 检查用户角色是否为none
				if (userInfo && userInfo.role === 'none') {
					// 清除登录状态
					uni.removeStorageSync('access_token');
					uni.removeStorageSync('userInfo');
					
					// 使用模态框显示提示和openid，方便复制
					uni.showModal({
						title: '无权限访问',
						content: '您暂无权限访问，请联系管理员\n\n您的OpenID: ' + (userInfo.openid || '未知'),
						showCancel: false,
						confirmText: '确定'
					});
					return;
				}
				
				this.navigateAfterLogin();
				return;
			}
			
			// 检查授权状态
			this.checkAuthStatus();
		},
		methods: {
			// 检查授权状态
			checkAuthStatus() {
				uni.getSetting({
					success: (res) => {
						if (res.authSetting['scope.userInfo']) {
							// 已经授权，可以直接获取用户信息
							console.log('用户已授权');
							uni.getUserInfo({
								success: (userInfoRes) => {
									// 获取用户信息成功，执行登录流程
									this.doWxLogin(userInfoRes.userInfo);
								},
								fail: () => {
									console.log('获取用户信息失败，需要重新授权');
								}
							});
						} else {
							// 未授权，用户需要点击授权按钮
							console.log('用户未授权，等待用户点击授权按钮');
						}
					},
					fail: () => {
						console.log('获取授权设置失败');
					}
				});
			},
			
			// 处理获取用户信息
			handleGetUserInfo(e) {
				if (this.isLoading) return;
				
				// 简化userInfo检查
				const userInfo = e.detail && e.detail.userInfo;
				
				// 用户拒绝授权
				if (!userInfo) {
					uni.showToast({
						title: '请授权后继续使用',
						icon: 'none'
					});
					return;
				}
				
				this.isLoading = true;
				uni.showLoading({ title: '登录中...' });
				
				// 纯回调方式登录，避免Promise
				this.doWxLogin(userInfo);
			},
			
			// 执行微信登录 - 纯回调方式，不使用Promise
			doWxLogin(userInfo) {
				// 第一步：调用微信登录API获取code
				uni.login({
					success: (loginRes) => {
						// 获取code成功
						const code = loginRes && loginRes.code;
						if (!code) {
							this.handleLoginError('获取授权码失败');
							return;
						}
						
						console.log('获取code成功:', code);
						// 第二步：调用后端登录接口
						this.callLoginApi(code, userInfo);
						
					},
					fail: (err) => {
						console.error('微信登录失败:', err);
						this.handleLoginError('微信登录失败，请重试');
					}
				});
			},
			
			// 调用后端登录API
			callLoginApi(code, userInfo) {
				const loginParams = { code, userInfo };
				console.log('准备调用登录接口，参数:', loginParams);
				
				// 使用回调方式调用API，避免async/await
				api.user.wxLogin(loginParams)
					.then(apiRes => {
						try {
							// 检查apiRes是否为字符串，如果是则解析
							let responseData = apiRes;
							if (typeof apiRes === 'string') {
								responseData = JSON.parse(apiRes);
							}
							
							// 如果apiRes.data是字符串，尝试解析
							if (responseData.data && typeof responseData.data === 'string') {
								responseData.data = JSON.parse(responseData.data);
							}
							
							console.log('登录接口返回数据:', responseData);
							
							// 简化结果检查
							const access_token = responseData && responseData.access_token;
							const apiUserInfo = responseData && responseData.user;
							
							if (!access_token) {
								this.handleLoginError('服务器返回数据异常');
								return;
							}
							
							console.log('responseData:');
							console.log(responseData);
							// 检查用户角色
							if (apiUserInfo && apiUserInfo.role === 'none') {
								// 在模态框中显示openid
								const openid = apiUserInfo.openid || '未知';
								
								// 隐藏登录加载
								uni.hideLoading();
								this.isLoading = false;
								
								// 使用模态框显示，方便管理员查看
								uni.showModal({
									title: '无权限访问',
									content: '您暂无权限访问，请联系管理员\n\n您的OpenID: ' + openid,
									showCancel: false,
									confirmText: '确定'
								});
								
								// 存储用户信息以便于调试
								console.log('无权限用户信息:', apiUserInfo);
								return;
							}
							
							// 存储access_token和用户信息
							uni.setStorageSync('access_token', access_token);
							if (apiUserInfo) {
								uni.setStorageSync('userInfo', apiUserInfo);
							}
							
							// 处理登录成功
							this.handleLoginSuccess();
						} catch (parseError) {
							console.error('解析服务器响应失败:', parseError);
							this.handleLoginError('解析服务器数据失败');
						}
					})
					.catch((error) => {
						console.error('API调用失败:', error);
						this.handleLoginError('登录失败，请稍后再试');
					});
			},
			
			// 处理登录成功
			handleLoginSuccess() {
				uni.hideLoading();
				this.isLoading = false;
				
				uni.showToast({
					title: '登录成功',
					icon: 'success'
				});
				
				// 延迟导航
				setTimeout(() => {
					this.goToHomePage();
				}, 1500);
			},
			
			// 处理登录错误
			handleLoginError(message) {
				uni.hideLoading();
				this.isLoading = false;
				
				uni.showToast({
					title: message || '登录失败，请重试',
					icon: 'none'
				});
			},
			
			// 登录成功后的导航
			navigateAfterLogin() {
				// 直接去首页，简化导航逻辑
				this.goToHomePage();
			},
			
			// 跳转到首页
			goToHomePage() {
				uni.switchTab({
					url: '/pages/list/list',
					fail: () => {
						// 如果switchTab失败，尝试用reLaunch
						uni.reLaunch({
							url: '/pages/list/list'
						});
					}
				});
			},
			
			// 重定向到指定页面 - 保留但简化实现
			redirectTo(url) {
				if (!url) {
					this.goToHomePage();
					return;
				}
				
				uni.redirectTo({
					url: url,
					fail: () => {
						this.goToHomePage();
					}
				});
			}
		}
	}
</script>

<style>
	.login-container {
		min-height: 100vh;
		background-color: #f5f5f5;
		padding: 60rpx 40rpx;
		display: flex;
		flex-direction: column;
		align-items: center;
	}
	
	.logo-area {
		display: flex;
		flex-direction: column;
		align-items: center;
		margin-bottom: 80rpx;
	}
	
	.logo {
		width: 160rpx;
		height: 160rpx;
		margin-bottom: 20rpx;
	}
	
	.title {
		font-size: 40rpx;
		font-weight: bold;
		color: #333;
	}
	
	.login-card {
		width: 100%;
		background-color: #fff;
		border-radius: 20rpx;
		padding: 40rpx;
		box-shadow: 0 4rpx 20rpx rgba(0, 0, 0, 0.1);
	}
	
	.welcome-text {
		margin-bottom: 60rpx;
	}
	
	.welcome {
		font-size: 36rpx;
		font-weight: bold;
		color: #333;
		display: block;
		margin-bottom: 10rpx;
	}
	
	.tips {
		font-size: 28rpx;
		color: #999;
	}
	
	.wx-login-btn {
		display: flex;
		align-items: center;
		justify-content: center;
		height: 90rpx;
		background-color: #F3B250;
		color: #fff;
		border-radius: 45rpx;
		margin-bottom: 30rpx;
	}
	
	.wx-login-btn[disabled] {
		background-color: rgba(243, 178, 80, 0.6);
		color: rgba(255, 255, 255, 0.8);
	}
	
	.wx-icon {
		width: 40rpx;
		height: 40rpx;
		margin-right: 10rpx;
	}
	
	.policy-text {
		font-size: 24rpx;
		color: #999;
		text-align: center;
	}
</style> 